<script setup lang="ts">
import { onMounted, useSlots, type Component, type VNode, isVNode, nextTick } from 'vue'

const slots = useSlots()

console.log(slots.default!!())

function dumpSlots() {
  // console.log(slots)
  // console.log(slots.default)
  // const lst = slots.default!!(slots.default!!())
  // console.log(lst.length)
  // let idx = 0
  // for (const m of lst) {
  //   // console.log(`[${idx++}]-------------------------------------`)
  //   console.log(idx++, m)
  // }
}

onMounted(() => {
  setTimeout(dumpSlots, 1000)
  // nextTick(() => dumpSlots())
})
</script>
<template>
  <div class="slot-container">
    <div>Slot-Demo</div>
    <slot />
  </div>
</template>
<style lang="scss">
.slot-container {
  background-color: #fff;
  padding: 1em;
  > div {
    margin-bottom: 1em;
  }
}
</style>
